<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>layui</title>
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, maximum-scale=1"
    />
    <link
      rel="stylesheet"
      href="../../lib/layui-v2.5.5/css/layui.css"
      media="all"
    />
    <link rel="stylesheet" href="../../css/public.css" media="all" />
  </head>
  <body>
    <div class="layuimini-container">
      <div id="Myloading">
        <img
          src="../../lib/layui-v2.5.5/css/modules/layer/default/loading-01.gif"
          alt=""
        />
      </div>
      <script type="text/html" id="toolbarDemo">
        <div class="layui-btn-container">
          <button
            class="layui-btn layui-btn-sm data-add-btn"
            lay-event="delete"
          >
            {{d.where.name}}
          </button>
        </div>
      </script>

      <div class="layuimini-main">
        <table
          class="layui-hide"
          id="currentTableId"
          lay-filter="currentTableFilter"
        ></table>
      </div>

      <script type="text/html" id="currentTableBar">
        <a
          class="layui-btn layui-btn-xs data-count-edit"
          layuimini-content-href="page/table/flowCurve.html"
          data-title="流量曲线观测"
          lay-event="edit"
          >曲线</a
        >
      </script>
    </div>
    <script src="../../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
    <script src="../../js/lay-config.js?v=1.0.4" charset="utf-8"></script>
    <script>
      layui.use(["form", "table", "miniTab"], function () {
        // 2020-03-25 HF 保存token
        var token = sessionStorage.getItem("newtoken");
        var Fmeter = JSON.parse(sessionStorage.getItem("SaveFmeter"));

        var $ = layui.jquery,
          form = layui.form,
          miniTab = layui.miniTab,
          table = layui.table;
        miniTab.listen();
        /*********************************************/
        $("#Myloading").remove();

        // 页面初始化
        $.ajax({
          url:
            "/oms-web/flowMeter/times?token=" +
            token +
            "&rtuno=" +
            Fmeter.termNumber,
          dataType: "json",
          type: "get",
          contentType: "application/json",
          success: function (data) {
            if (data.code == -1) {
              window.location = "../login-1.html";
            }
            var u = [];
            var k = {};
            if (data.code === 0) {
              if (data.data != null && data.data != undefined) {
                var a = [];
                for (var i in data.data) {
                  var c = {
                    time: data.data[i],
                  };
                  a.push(c);
                }
                getMeter(a);
              }
            }
          },
          error: function () {
            layer.msg("数据出错！");
          },
        });

        /*********************************************/
        function getMeter(data) {
          table.render({
            elem: "#currentTableId",
            data: data,
            where: { name: Fmeter.text },
            toolbar: "#toolbarDemo",
            defaultToolbar: [
              "filter",
              "exports",
              "print",
              {
                title: "提示",
                layEvent: "LAYTABLE_TIPS",
                icon: "layui-icon-tips",
              },
            ],

            cols: [
              [
                { type: "numbers", title: "ID", width: 100, align: "center" },
                {
                  field: "time",
                  minWidth: 1000,
                  title: "时间",
                  align: "center",
                },
                {
                  title: "操作",
                  minWidth: 80,
                  templet: "#currentTableBar",
                  fixed: "right",
                  align: "center",
                },
              ],
            ],
            limits: [10, 15, 20, 25, 50, 100],
            limit: 15,
            page: true,
            done: function (res) {
              if (res.code == -1) {
                window.location = "../login-1.html";
              }
              // 表格渲染完成回调
            },
          });
        }

        // 监听搜索操作
        form.on("submit(data-search-btn)", function (data) {
          var result = JSON.stringify(data.field);
          layer.alert(result, {
            title: "最终的搜索信息",
          });

          //执行搜索重载
          table.reload(
            "currentTableId",
            {
              page: {
                curr: 1,
              },
              where: {
                searchParams: result,
              },
            },
            "data"
          );

          return false;
        });

        /**
         * toolbar监听事件
         */
        table.on("toolbar(currentTableFilter)", function (obj) {
          if (obj.event === "add") {
            // 监听添加操作
            var index = layer.open({
              title: "添加用户",
              type: 2,
              shade: 0.2,
              maxmin: true,
              shadeClose: true,
              area: ["100%", "100%"],
              content: "./table/add.html",
            });
            $(window).on("resize", function () {
              layer.full(index);
            });
          } else if (obj.event === "delete") {
            // 监听删除操作
          }
        });

        //监听表格复选框选择
        table.on("checkbox(currentTableFilter)", function (obj) {
          console.log(obj);
        });

        // 获取列表data
        table.on("tool(currentTableFilter)", function (obj) {
          var data = obj.data;
          if (obj.event === "edit") {
            sessionStorage.setItem("SaveTimeFlow", JSON.stringify(data));
          } else if (obj.event === "delete") {
            // layer.confirm('真的删除行么', function (index) {
            //     obj.del();
            //     layer.close(index);
            // });
          }
        });
      });
    </script>
  </body>
</html>
